<template>
	<div id="delivery_plan" v-loading="$store.state.saving"
				element-loading-text="保存中" element-loading-spinner="el-icon-loading"
				element-loading-background = "rgba(255,255,255,0.8)">
		<el-tabs >
			<el-tab-pane label="交付计划">
				<el-form :model="delivery" ref="deliveryRef" :rules="deliveryRules" label-width="110px" class="demo-ruleForm" style="overflow:hidden">
					<el-form-item label="客户">
						<el-input disabled v-model="contract.customer.customerName"></el-input>
					</el-form-item>
					<el-form-item label="合同名称">
						<el-input disabled v-model="contract.contractNum"></el-input>
					</el-form-item>
					<el-form-item prop="deliveryPlanDate" label="计划交付日期" class="inline__">
						<el-date-picker type="date" style="width:100%" v-model="delivery.deliveryPlanDate" :picker-options="deliveryTimeOptions" placeholder="请选择交付日期"></el-date-picker>
					</el-form-item>
					<el-form-item prop="deliveryTime" label="期次" class="inline__">
						<el-select v-model="delivery.deliveryTime" value-key="id" style="width:100%!important">
							<el-option v-for="item in deliveryTimes" :key="item.id" :label="item.name" :value="item" :disabled="!issue(item)"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="金额" class="inline__">
						<el-input v-model="total_money" readonly></el-input>
					</el-form-item>
					<el-form-item label="负责人" style="width:100%" class="inline__">
						<el-select filterable v-model="delivery.principal" value-key="empId" style="width:100% !important">
							<el-option-group v-for="d in  dept_emps" :key="d.departmentId" :label="d.departmentName">
								<el-option v-for="e in d.deEmp" :key="e.empId" :label="e.empName" :value="e"></el-option>
							</el-option-group>
						</el-select>
					</el-form-item>
					<el-form-item label="备注">
						<el-input type="textarea" v-model="delivery.remark"></el-input>
					</el-form-item>
					<el-form-item>
						<el-button :disabled="this._parent.isNew(delivery) || total_money<= 0" type="primary" @click="submit('deliveryRef')">
							{{ this._parent.isNew(delivery)?"已交付，不可修改":"保存" }}
						</el-button>
						<el-button v-if="delivery.deliveryPlanId && !this._parent.isNew(delivery)" @click="deleteDelivery" type="danger">删除</el-button>
						<el-button @click="cancel">取消</el-button>
					</el-form-item>
				</el-form>
			</el-tab-pane>
			<el-tab-pane label="产品">
				<el-table  :data="contract.productList">
					<el-table-column label="图片">
						<template slot-scope="s">
							<el-image :src="s.row.proDetail.proImgSrc" style="width:40px;height:40px;"></el-image>
						</template>
					</el-table-column>
					<el-table-column :show-overflow-tooltip="true" prop="proDetail.product.productName" label="名称"></el-table-column>
					<el-table-column :show-overflow-tooltip="true" label="规格属性">
						<template slot-scope="s">
							<span v-for="item in s.row.proDetail.abilities" :key="item.abilityId">{{item.abilityName}}</span>
						</template>
					</el-table-column>
					<el-table-column  :show-overflow-tooltip="true" prop="proDetail.product.productBrand" label="品牌"></el-table-column>
					<el-table-column label="售价">
						<template slot-scope="s">
							<span>{{s.row.discount}}元</span>
						</template>
					</el-table-column>
					<el-table-column label="数量" prop="proCount">
					</el-table-column>
					<el-table-column label="金额">
						<template slot-scope="s">
							{{ s.row.discount * s.row.proCount }}
						</template>
					</el-table-column>
					<el-table-column label="交付数量" width="200" >
						<template slot-scope="s">
							<el-input-number :min="0" :max="maxNumber(s.row)" size="small"  v-model="s.row.deliveryCount"></el-input-number>
						</template>
					</el-table-column>
				</el-table>
			</el-tab-pane>
		</el-tabs>
	</div>
</template>

<script>
export default {
	name: 'deliveryPlan',
	props: ["contract","_parent"],
	data() {
		return {
			dept_emps:[], 		// 部门员工对象
			// 交付计划对象
			delivery:{
				// 交付期次
				principal:this.$store.state.user,
				deliveryProLists:[],
				isRemind:1
			},

			// 交付期次
			deliveryTimes:{},
			// 表单验证规则
			deliveryRules:{
				deliveryTime:[
					{ required: true, message: '请选择交付期次', trigger: 'change' }
				],
				deliveryPlanDate:[
					{ required: true, message: '请选择交付期次', trigger: 'change' }
				]
			},
			// 时间限制，只能选择今天及之后的时间
			deliveryTimeOptions:{
				disabledDate(time){
					return time.getTime() < Date.now() - 8.64e7
				}
			}
		}
	},
	methods:{
		// 计算交付期次
		issue(rt){
			let flag = true
			this._parent.deliveryPlans.forEach(dp => {
				if(dp.deliveryTime.id == rt.id){
					flag = false
				}
				
			})
			return flag
		},
		// 删除计划
		deleteDelivery(){
			this.global.confirm("提示！", "确认删除",()=>{
				this.axios.delete("api/in-sale/delivery/"+this.delivery.deliveryPlanId)
				.then(res => {
					this.global.mes_success("删除成功")
					// 关闭弹窗
					this._parent.deliveryPlanDialogVisible = false
					// 刷新
					this._parent.initData()
				})
				.catch(err => {
					this.global.mes_error("删除失败！")
				})
			}, ()=>{
				this.global.mes_message("取消删除")
			})
			
		},
		// 获取初始化数据
		getDeliverTime(){
			this.axios.get("api/dd/delivery_time")
			.then(res => {
				this.deliveryTimes = res.data
			})
			.catch()
			/* 获取部门员工列表 */
			this.axios.get("api/dept_emps")
			.then(res => {
				this.dept_emps = res.data
			})
			.catch(
			)
		},
		// 计算最大交付数量
		maxNumber(row){
			let num = 0
			this._parent.deliveryPlans.forEach(dp => {
				if (dp.deliveryPlanId !== this.delivery.deliveryPlanId){
					dp.deliveryProLists.forEach(dpl => {
						if (row.listId === dpl.productList.listId){
							num += dpl.deliveryCount
						}
					})
				}
			})
			return row.proCount - num
		},
		// 表单提交
		submit(formName){
			this.$refs[formName].validate((valid) => {
				if (valid){
					// 将合同对象添加入交付计划对象中
					this.delivery.contract = this.contract
					// 处理交付数量
						// 判断是否为修改
					if (this.delivery.deliveryProLists && this.delivery.deliveryProLists.length > 0){
						this.contract.productList.forEach(pl => {
							this.delivery.deliveryProLists.forEach(dpl => {
								if (dpl.productList.listId === pl.listId){
									dpl.deliveryCount = pl.deliveryCount
								}
							})
						})
					}else{
						// 新增的交付数量处理
						this.contract.productList.forEach(pl => {
							// 判断交付数量大于0
							if (!pl.deliveryCount){
								pl.deliveryCount = 0
							}
							let DeliveryProList = {}
							DeliveryProList.deliveryCount = DeliveryProList.deliveriedCount = pl.deliveryCount
							delete pl.deliveryCount
							DeliveryProList.productList = pl
							this.delivery.deliveryProLists.push(DeliveryProList)
						})
					}
					this.$store.state.saving = true
					this.axios.post("api/in-sale/delivery",this.delivery)
					.then(()=>{
						this.$store.state.saving = false
						this.global.mes_success("交付计划保存成功！")
						// 关闭弹窗
						this._parent.deliveryPlanDialogVisible = false
						// 还原对象
						this.delivery={
							// 交付期次
							deliveryPlanDate: new Date(),
							principal:this.$store.state.user,
							deliveryProLists:[],
							isRemind:1
						}
						// 刷新
						this._parent.initData()
					})
					.catch(() => {
						this.$store.state.saving = false
						this.global.mes_errot("交付计划保存失败，请稍后再试！")
					})
				}else{
					this.global.mes_error("数据校验不通过，请修改后再重新提交！")
					return false
				}
			})
		},
		cancel(){
			// 关闭弹窗
			this._parent.deliveryPlanDialogVisible = false
		}
	},
	created(){
		this.getDeliverTime()
	},
	computed:{
		total_money(){
			let total = 0
			this.contract.productList.forEach(pro => {
				total += parseInt(pro.deliveryCount?pro.deliveryCount:0) * pro.discount
			})
			return total
		}
	}
}
</script>

<style scoped>
#delivery_plan .el-form-item{width: 100%;margin-bottom: 22px !important;}
.inline__{width:50%!important;display:inline-block}
</style>